<template>
    <div>
        <el-card class="box-card">
            <template #header>
                <div class="card-header">
                    <el-button class="button" text>
                        {{ props.data.examineType === 1 ?
                            '按人员审核' : props.data.examineType === 2 ?
                                '按角色审核' : '按部门审核'
                        }}
                    </el-button>
                </div>
            </template>
            <div v-for="item in props.data.examineList" :key="item" class="text item">
                {{ props.data.examineType === 1 ?
                    `工号:${item.code}` : props.data.examineType === 2 ?
                        `角色编号:${item.code}` : `部门编号:${item.code}` }}
            </div>
            <div v-for="item in props.data.examineList" :key="item" class="text item">
                {{ props.data.examineType === 1 ?
                    `姓名:${item.name}` : props.data.examineType === 2 ?
                        `角色名称:${item.name}` : `部门名称:${item.name}` }}
            </div>
            <template #footer>
                <el-button type="primary" size="small">修改</el-button>
            </template>
        </el-card>
    </div>
</template>

<script setup lang="ts">
const props = defineProps({
    data: {
        type: Object,
        required: true,
    },
})

</script>
<style>
.card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.text {
    font-size: 14px;
}

.item {
    margin-bottom: 18px;
}

.box-card {
    width: 240px;
}
</style>